import { Pressable, View, StyleSheet, Text } from 'react-native'
import { flexCol } from '../../assets/style/common'
export default function OwlRadioBox(props: {
  choosed?: boolean
  onPress?: () => void
  style?: any
  label?: string
  iconSource?: any
}) {
  return (
    <Pressable
      style={StyleSheet.compose(props.style, flexCol.default)}
      onPress={props.onPress}
    >
      <View style={RadioStyle.radioWrap}>
        <View
          style={StyleSheet.compose(
            RadioStyle.radio,
            props.choosed ? RadioStyle.radioActive : {},
          )}
        >
          <Text style={RadioStyle.image}>&#xe645;</Text>
        </View>
      </View>
      {props.label && <Text style={RadioStyle.label}>{props.label}</Text>}
    </Pressable>
  )
}
const RadioStyle = StyleSheet.create({
  radio: {
    width: 18,
    height: 18,
    borderRadius: 9,
    borderWidth: 1,
    borderColor: '#ccc',
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
  },
  image: {
    fontSize: 14,
    fontFamily: 'iconfont',
    color: '#fff',
  },
  radioActive: {
    borderColor: '#f392a6',
    backgroundColor: '#f392a6',
  },
  label: {
    fontSize: 14,
    color: '#333',
  },
  radioWrap: {
    padding: 12,
  },
})
